class Slots {
    constructor(param){
        this.ctx = param.ctx;           // Canvas的绘图上下文
        this.data = param.data;       // 端口数组
        this.drawPoint(this.data)
    }

    startdraw() {
        // 如果需要每次都清空画布，可以在这里添加 clear 操作
        // this.ctx.clearRect(0, 0, this.ctx.canvas.width, this.ctx.canvas.height);

        // 遍历端口数组，逐个绘制
        this.ports.forEach(port => {
            // 假设每个 port 对象中有 x, y, width, height, fillStyle, strokeStyle 属性
            this.drawPoint({
                x: port.x,
                y: port.y,
                width: port.width,
                height: port.height,
                fillStyle: port.fillStyle,
                strokeStyle: port.strokeStyle
            });
        });
    }

    drawPoint (data) {
        this.ctx.fillStyle = data.fillStyle;
        this.ctx.fillRect(data.x, data.y, data.width, data.height);

        this.ctx.strokeStyle = data.strokeStyle;
        this.ctx.lineWidth = 2;
        this.ctx.strokeRect(data.x, data.y, data.width, data.height);
        this.ctx.restore();
    }

    init () {}
}

export default Slots;
